import { reactive } from 'vue'

export interface ITempChild {
    name: string
    scssVar: string
    title: string
    model: string
    showAlpha: boolean
}

export interface ITemp {
    topChatTextColor: ITempChild
    topSearchStyle: ITempChild
    topSettingStyle: ITempChild
    menuBgStyle: ITempChild
    menuActiveStyle: ITempChild
    menuTextStyle: ITempChild
    menuHoverColorStyle: ITempChild
    breadcrumbTextStyle: ITempChild
    breadcrumbActiveStyle: ITempChild
    breadcrumbHoverStyle: ITempChild
    [key: string]: any
}

export const temp = reactive<ITemp>({
    topChatTextColor: {
        name: 'topChatTextColor',
        scssVar: '--header-chat-text-color',
        title: '顶栏消息文字色',
        model: '',
        showAlpha: false,
    },
    topSearchStyle: {
        name: 'topSearchStyle',
        scssVar: '--search-bg-primary',
        title: '顶栏搜索框主题色',
        model: '',
        showAlpha: false,
    },
    topSettingStyle: {
        name: 'topSettingStyle',
        scssVar: '--header-setting-color',
        title: '顶栏主题设置文字色',
        model: '',
        showAlpha: false,
    },
    menuActiveStyle: {
        name: 'menuActiveStyle',
        scssVar: '--menu-active-text-color',
        title: '菜单栏目文字激活色',
        model: '',
        showAlpha: false,
    },
    menuTextStyle: {
        name: 'menuTextStyle',
        scssVar: '--menu-text-color',
        title: '菜单栏目文字色',
        model: '',
        showAlpha: false,
    },
    menuBgStyle: {
        name: 'menuBgStyle',
        scssVar: '--menu-bg-color',
        title: '菜单栏目背景色',
        model: '',
        showAlpha: true,
    },
    menuHoverColorStyle: {
        name: 'menuHoverColorStyle',
        scssVar: '--menu-hover-bg-color',
        title: '菜单栏目悬停色',
        model: '',
        showAlpha: true,
    },
    breadcrumbTextStyle: {
        name: 'breadcrumbTextStyle',
        scssVar: '--breadcrumb-text-color',
        title: '面包屑文字色',
        model: '',
        showAlpha: false,
    },
    breadcrumbActiveStyle: {
        name: 'breadcrumbActiveStyle',
        scssVar: '--breadcrumb-active-bg',
        title: '面包屑激活色',
        model: '',
        showAlpha: true,
    },
    breadcrumbHoverStyle: {
        name: 'breadcrumbHoverStyle',
        scssVar: '--breadcrumb-hover-bg',
        title: '面包屑悬停色',
        model: '',
        showAlpha: true,
    },
})

export interface ITempSwitchChild {
    title: string
    openIcon: any
    closeIcon: any
    model: boolean
}

export interface ITempSwitch {
    dark: ITempSwitchChild
}
